<!-- 选择变压器 -->
<template>
	<uni-popup ref="popup" background-color="#fff">
		<view class="userinfoselect-dom">
			<view class="p40">
				<uni-row class="demo-uni-row ">
					<uni-col :span="14" :offset="5">
						<view class="userinfoselect-dom-title">选择变压器</view>
					</uni-col>
					<uni-col :span="5">
						<view class="t-r">
							<uni-icons @click="cancelClick" type="closeempty" size="15" class="p20"></uni-icons>
						</view>
					</uni-col>
				</uni-row>
			</view>
			<scroll-view class="contentshow" scroll-y :show-scrollbar='true' :enhanced='true'>
				<uni-list v-if="byqList.length" class="userinfoselect-list" :avatar-circle="true">
					<uni-list-item v-for="(item, index) in byqList" :key="index" direction="column" clickable >
						<template v-slot:header>
							<view class="userinfoselec-title text-left-right">
								<text>{{item.sbmc}}</text>
								<checkbox :checked="item.select"  @click="checkboxchange(item)"/>
							</view>
							<view class="text-left-right">
								<text>资源编号：{{String(item.zybh)}}</text>
								<text>配电编号：{{String(item.pdbh)}}</text>
							</view>
							<view class="text-left-right">
								<view>设备容量：{{item.byqrl}}</view>
								<view>
									<text>运行状态：</text>
									<uni-tag v-if="item.dqzt=='0'"   text="运行" type="success" />
									<uni-tag v-else text="停止"  />
								</view>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
				<cNoData v-if="byqList.length < 1" />
			</scroll-view>
			<button type="primary" @click="selectOk" style="margin: 10px;">确认选择</button>
		</view>
	</uni-popup>
</template>

<script setup lang="ts">
	import cNoData from "@/pages/bspsd/components/no-data.vue";
	import { onMounted, ref } from 'vue';
	const props = defineProps({
		byqList: { // 直接丢 要选择的数据  已经选择的回来默认选择 
			type: Array,
			default: () => []
		},
	})
	const emit = defineEmits(['selectByq', 'selectByqCancel'])
	let popup = ref(null)

	onMounted(() => {
		popup.value.open('bottom')
	})
	function checkboxchange(item){
		item.select = !item.select
	}
	function selectOk(){
		let list = props.byqList.filter(item => item.select)
		if(list.length < 1){
			uni.showToast({ icon: "none", title: "请选择变压器" })
		}else{
			selectByqOK(list)
		}
	}
	function selectByqOK(list){
		popup.value.close()
		emit('selectByq', list)
	}
	function cancelClick(){
		emit('selectByqCancel', false)
		popup.value.close()
	}
</script>

<style lang="scss" scoped>
	.userinfoselect-dom-title {
		color: #3b4144;
		font-size: 30rpx;
		text-align: center;
	}

	.contentshow {
		max-height: 70vh;
	}

	.userinfoselec-title {
		line-height: 1.8;
		color: #3b4144;
		font-size: 28rpx;
	}

	.userinfoselec-describe {
		line-height: 1.8;
		color: #999;
		font-size: 24rpx;

	}
</style>